<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // map --- 遍历
        // let arr1 = [1,2,3,4,5]

        // let newArr1 = arr1.map(item => {
        //     return `<li>${item}</li>`
        // })

        // console.log(newArr1.join(''))
        // filter --- 过滤
        // 对数组进行顾虑，返回的是所有满足条件的数组元素，并且生成新数组

        // let arr2 = [1,2,3,4,5,6,7,8,9,10]

        // let newArr2 = arr2.filter(item => {
        //     return item > 5
        // })

        // console.log(newArr2)

        // let obj = {
        //     name: 'tom',
        //     age: 18,
        //     height: 180
        // }

        // keys
        // console.log(Object.keys(arr1))
        // console.log(Object.keys(obj));

        // values
        // console.log(Object.values(arr1));
        // console.log(Object.values(obj))

        // includes --- 包括
        // 如果参数中的值在字符串中存在，则返回true
        // 否则返回false

        // let arr3 = ['html', 'css', 'javascript', 'java', 'php']

        // let result = arr3.filter(item => {
        //     return item.includes('h') // true
        // })

        // console.log(result)

        // let str = '123456789'

        // console.log(str.includes('5'))

        // every --- 所有的
        // 返回值是布尔值  false  true
        // 遍历数组，根据回调函数中的判断条件来确定返回值
        // 只有所有的数组元素，满足判断条件，才会返回true

        // let arr4 = [1,2,3,4,5,6,7,8,9]

        // let result = arr4.every(item => {
        //     return item > 0
        // })

        // console.log(result)

        // some --- 一些
        // 数组中存在一个元素满足判断条件，那么返回true
        // 否则返回false

        // let result = arr4.some(item => {
        //     return item > 9
        // })

        // console.log(result)

        // reduce --- 累加
        // 需要在回调函数中存在return逻辑,retuan的值作为下一次prev的值
        // 第二个参数作为第一的累加的prev

        // 数组扁平化
        // 扁平化管理

        // 结构化管理
        // 第一级    普通同学
        // 第二季    班委
        // 第三季    老师
        // 第四季    校领导
        // 第五季    校长

        // let arr5 = [1,2,3,4,5,6,7,8,9]

        // let result = arr5.reduce((prev, next) => {
        //     console.log('prev', prev)
        //     console.log('next', next)
        //     return prev + next
        // }, 100)

        // console.log(result)

        let objArr = [
            {
                name: '爷爷',
                age: '80',
                children: [
                    {
                        name: '爸爸',
                        age: '50',
                        children: [
                            {
                                name: '儿子',
                                age: '20',
                                children: [
                                    {
                                        name: '孙子',
                                        age: 3
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ]

        // console.log(objArr)

        // 把结构化的数组，变成扁平化

        // 递归
        // function test (arr, list = []) {
        //     arr.forEach(item => {
        //         list.push(item)

        //         if (item.children && item.children.length) {
        //             return test(item.children, list)
        //         }
        //     })

        //     return list
        // }

        // console.log(test(objArr))

        // 作业--数组扁平化，用reduce来做
        let flat = function (arr) {
            return arr.reduce((prev, next) => {
                return next.children ? prev.concat(next, flat(next.children)) : prev.concat(next) 
            }, [])
        }

        console.log(flat(objArr))

    </script>
</body>
</html>